//
//  SwipeCardView.swift
//  Example
//
//  Created by scy on 2024/12/28.
//

import SwiftUI

struct SwipeCardView: View {
    let item: String

    @State private var cardData = [
        "Card 1", "Card 2", "Card 3", "Card 4", "Card 5"
    ]
    @State private var likedItems: [String] = []
    @State private var dislikedItems: [String] = []
    
    var body: some View {
        ZStack {
            ForEach(cardData.indices.reversed(), id: \.self) { index in
                CardView(text: cardData[index]) {
                    withAnimation {
                        removeCard(at: index, liked: true)
                    }
                } onDislike: {
                    withAnimation {
                        removeCard(at: index, liked: false)
                    }
                }
                .zIndex(Double(index))
            }
        }
        .padding()
        .overlay(
            VStack {
                Text("Liked Items: \(likedItems.joined(separator: ", "))")
                    .font(.headline)
                    .foregroundColor(.green)
                Text("Disliked Items: \(dislikedItems.joined(separator: ", "))")
                    .font(.headline)
                    .foregroundColor(.red)
            }
            .padding(.top, 50),
            alignment: .top
        )
        .navigationBarTitle(item, displayMode: .inline)
    }
    
    private func removeCard(at index: Int, liked: Bool) {
        let removedCard = cardData.remove(at: index)
        if liked {
            likedItems.append(removedCard)
        } else {
            dislikedItems.append(removedCard)
        }
    }
}

struct CardView: View {
    let text: String
    let onLike: () -> Void
    let onDislike: () -> Void
    
    @State private var translation: CGSize = .zero
    @State private var isLiked: Bool = false
    
    var body: some View {
        ZStack {
            RoundedRectangle(cornerRadius: 16)
                .fill(isLiked ? Color.green : Color.red)
                .shadow(radius: 5)
            
            Text(text)
                .font(.largeTitle)
                .foregroundColor(.white)
        }
        .frame(height: 300)
        .rotationEffect(.degrees(Double(translation.width / 10)))
        .offset(x: translation.width, y: 0)
        .gesture(
            DragGesture()
                .onChanged { value in
                    translation = value.translation
                    isLiked = translation.width > 0
                }
                .onEnded { _ in
                    if abs(translation.width) > 100 {
                        if isLiked {
                            onLike()
                        } else {
                            onDislike()
                        }
                    } else {
                        withAnimation {
                            translation = .zero
                        }
                    }
                }
        )
        .animation(.spring(), value: translation)
    }
}

//#Preview {
//    SwipeCardView()
//}
